p5js*
家紋の模写をp5jsでやってみる
<家紋の名前>
丸に三つ鱗(原画)
<制作手順>
1.let num関数を600に設定する(キャンバスの大きさを600×600にするため)
2.creative canbasで値を600×600を設定する代わりに先ほどのnumを使い、
creative canbas(num,num)とかく
3.家紋のベースとなる塗りつぶされた黒い円形の枠をellipseを使ってかく、
その際、最初に黒色の円 fill(0) ellipse(num / 2, num / 2, num , num)をかき、
それより少し小さい白色の円 fill(0) ellipse(num / 2, num / 2, num 1.15, num 1.15)をかく
4.三角形をtriangleで作図し、それぞれの頂点をXY座標を使って指定する
fill(0); // 塗りつぶしの色
triangle(201, 235, 407, 235, 300, 45);
// 三角形1を生成(始点のx軸, 始点のy軸, 2点目のx軸, 2点目のy軸, 終点のx軸, 終点のy軸)
fill(0); // 塗りつぶしの色
triangle(90, 433, 306, 433, 199, 238);
// 三角形2を生成(始点のx軸, 始点のy軸, 2点目のx軸, 2点目のy軸, 終点のx軸, 終点のy軸)
fill(0); // 塗りつぶしの色
triangle(310, 433, 505, 433, 407, 238);
// 三角形3を生成(始点のx軸, 始点のy軸, 2点目のx軸, 2点目のy軸, 終点のx軸, 終点のy軸)
<レビューを受けて>
キャンバスに家紋の名前を追加しました
textSize(13);//文字の大きさ
text('丸に三つ鱗', 530, 540);//家紋の名前
fill(0, 102, 153);